<script language="javascript" type="text/javascript">	
function js_folding(obj, rowNum)
{
	var tr = obj.parentNode.parentNode;
	var tbl = tr.parentNode.parentNode;
	var img = tr.getElementsByTagName("IMG")[0];

	if (rowNum > 0)
	{
	  var src = img.src.substr(img.src.lastIndexOf('/') + 1);
	  var rowIndex = tr.rowIndex + 1;
	
	  if (src == "l_010.gif"){		  
		var subLevel = parseInt(tr.getAttribute('level')) + 1;
		for(var i=0;i<rowNum; i++){
		  var row = tbl.rows[rowIndex+i];
		  var level = parseInt(row.getAttribute('level'));
		  if (level == subLevel) row.style.display="";
		}
		img.src = "images/darkgreen/l_009.gif";
	  }else{
		for(var i=0;i<rowNum; i++){
		  var row = tbl.rows[rowIndex+i];
		  var child = parseInt(row.getAttribute('child'));
		  if (child > 0){
			row.getElementsByTagName("IMG")[0].src = "images/darkgreen/l_010.gif";
		  }
		  row.style.display="none";
		}
		img.src = "images/darkgreen/l_010.gif";
	  }
	}else{
	  img.src = "images/darkgreen/l_009.gif";
	}
}

</script>

<div class="product_left">
	<h1><img src="images/darkgreen/l_008.gif" border="0" /></h1>
	<table cellspacing="0">
		<!--{loop $leftListArr $key $vlist}-->
		<tr id="" level="{$vlist[level]}" child="{$vlist[child]}" >
		  <td class="first-cell" style="line-height:22px;"><img id="{$vlist[categoryId]}_leftMenu" __parentId="{$vlist[parentId]}" _level="{$vlist[level]}" childId="{$vlist[child]}" src="images/darkgreen/{if $vlist[child] != 0}l_009.gif{else}l_009.gif{/if}" style="padding-left:{$vlist[level]}em;cursor:pointer;" width="11" height="12" border="0" onclick="js_folding(this, {$vlist[child]})" /> <a id="menu_{$vlist[categoryId]}" Mid='{$vlist[categoryId]}' href="{if $vlist[level]==1}product-list-{$vlist[categoryId]}-big.htm{elseif $vlist[level]==2}product-list-{$vlist[categoryId]}.htm{elseif $vlist[level]==3}product-detail-{$vlist[categoryId]}.htm{/if}">{$vlist[cateName]}</a></td>
		</tr>		
	   <!--{/loop}--> 
	   <script language="javascript">
		
			jQuery('.first-cell img').each(function(){
				if(jQuery(this).attr('_level')==1) {					
					var imgId = jQuery(this).attr('id');
					js_folding(document.getElementById(imgId), jQuery(this).attr('childId'))
				}
			});
//			alert(jQuery('#{$categoryId}_leftMenu').attr('__level'))

			var _level = jQuery('#{$categoryId}_leftMenu');
			//product-detail-74.htm
			if(/product-detail-[0-9]+\.htm/.test(location.href)){
				var result =  location.href.match(/product-detail-([0-9]+)\.htm/);
				if(result[1]!='undefined') {
					jQuery('#menu_'+result[1]).css("color","red");;
				}				
			} else {
				_level.next().css("color","red");
			}
			if(_level.attr('_level')=='1') {
				jQuery('#{$categoryId}_leftMenu').click();
			} else if (_level.attr('_level')==2) {		
				jQuery("#"+_level.attr('__parentId') + '_leftMenu').click();
				jQuery('#{$categoryId}_leftMenu').click();
			} else if (_level.attr('_level')==3) {
				jQuery("#"+jQuery('#'+_level.attr('__parentId') + '_leftMenu').attr('__parentId') + '_leftMenu').click();
				jQuery("#"+_level.attr('__parentId') + '_leftMenu').click();
			}
		
		
		</script>
	</table>
</div>